﻿
<div class="col-lg-12">
    <div class="space-20 hidden-md hidden-lg"></div>
    <div class="space-4 hidden-sm hidden-xs"></div>
    <select id="state" name="">
        <option selected="" value="-1">全部</option>
        <option value="0">正常</option>
        <option value="1">已停用</option>
    </select>
    <select id="auth" name="">
        <option selected="" value="-1">全部</option>
        <option value="0">送货员</option>
        <option value="1">管理员</option>
    </select>
    <a href="javascript:void(0)" class="easyui-linkbutton" title="筛选" data-options="iconCls:'icon-search',plain:true,iconAlign:'right'" onclick="searchbtn(this,event)"><input class="input-small" type="text" name="" id="selecttext" value="" placeholder="请输入查询条件" style="vertical-align:middle;line-height:normal;" onclick="searchinput(this)" /></a>
    <div class="space-2"></div>
</div>
<div class="page-content">



    <table id="dg" class="easyui-datagrid" title="员工管理" style="width:100%;height:auto" data-options="
							rownumbers:true,
							checkOnSelect:false,
                            url:'/Emp/All',
                            toolbar: toolbar,
							pagination:true,
							pageSize:10,
							method:'get',
							selectOnCheck:false,
							fitColumns:true,
							singleSelect:true,
							">
        <thead>
            <tr>
                <th data-options="field:'act',formatter:editbtn,align:'left'">操作</th>
                <th data-options="field:'State',width:80,formatter:state,align:'center'">状态</th>
                <th data-options="field:'Role',width:80,formatter:auth,align:'center'">权限</th>
                <th data-options="field:'Name',width:80">用户账号</th>
                <th data-options="field:'Phone',width:120">电话号码</th>
            </tr>

        </thead>
    </table>
    <script type="text/javascript">
        $(function () {
            $(".nav-list li").eq(3).addClass("active");
            //page(1, 10);
            
        });

        var toolbar = [{
            text: '添加',
            iconCls: 'icon-add',
            handler: function (elem) {

                $("#form_add").form("clear");
                $("#win_add").window("open");
            }
        }];
        function editbtn(value, row, index) {

            var _btn = '<button class="btn btn-inverse btn-xs" style="margin:3px;" onclick="detailsline(' + row.E_ID + ',event)">待完成订单</button>';
            if (row.Auth == 0) {
                if (row.State == 0)
                    _btn += '<button class="btn btn-danger btn-xs" style="margin:3px;" onclick="freezeline(' + row.E_ID + ',event)">停用</button>';

                else
                    _btn += '<button class="btn btn-success btn-xs" style="margin:3px;" onclick="unfreezeline(' + row.E_ID + ',event)">恢复</button>';
            }
            return _btn;
        }
        function auth(value, row, index) {

            if (row.Auth == 1)
                return "<span class='gold'>管理员</span>";
            else
                return "<span class='yellow'>送货员</span>";

        }



        function searchinput(elem) {
            event.stopPropagation();
            $(elem).select();
        }
        function searchbtn(elem, event) {
            var e = event || window.event;
            e.stopPropagation();
            page(1);
        }


        function freezeline(ID, event) {
            var e = event || window.event;
            e.stopPropagation();
            if (confirm("是否禁用用该用户？")) {

                $.ajax({
                    type: 'get',
                    url: '/Emp/ChangeState',
                    data: { 'ID': ID, 'state': 1 },
                    success: function (data) {
                        if (data == 0) {

                        }
                        var pager = $("#dg").datagrid("getPager").pagination("options");

                        page(pager.pageNumber);
                    }
                })
            }

        }
        function unfreezeline(ID, event) {
            var e = event || window.event;
            e.stopPropagation();
            if (confirm("是否恢复该用户？")) {

                $.ajax({
                    type: 'get',
                    url: '/Emp/ChangeState',
                    data: { 'ID': ID, 'state': 0 },
                    success: function (data) {
                        if (data == 0) {

                        }
                        var pager = $("#dg").datagrid("getPager").pagination("options");

                        page(pager.pageNumber);
                    }
                })
            }
        }

        //生成随机状态，测试用，请删除
        function state(value, row, index) {
            //var _random = Math.floor(Math.random() * 2);
            switch (row.State) {
                case 1:
                    return "<span class='red'>已停用</span>";
                    break;
                case 0:
                    return "<span class='green'>正常</span>";
                    break;
                default:
                    return "<span class='green'>正常</span>";
                    break;
            }
        }

        function page(_pageNumber) {
            var p = {};
            p.pageNumber = _pageNumber;
            p.pageSize = $("#dg").datagrid("getPager").pagination("options").pageSize;
            p.selecttext = $("#selecttext").val();
            p.state = $("#state").val();
            p.auth = $("#auth").val();
            $.ajax({
                type: 'get',
                url: '/Emp/Select',
                async: true,
                dataType: 'json',
                data: p,
                success: function (data) {
                    $("#dg").datagrid("loadData", data);
                    $("#dg").datagrid("getPager").pagination({
                        onSelectPage: function (pageNumber, pageSize) {
                            page(pageNumber, pageSize);

                        },
                        onRefresh: function (pageNumber, pageSize) {
                            page(pageNumber, pageSize);
                        }
                    });
                }
            });
        }

        function submit(id) {
            if ($("#newName").val() == "" || $("#newPwd2").val() == "") {
                alert("用户名或密码不能为空。");
                return;
            }
            /*验证数据*/
            $(id).form('submit', {
                success: function (data) {
                    if (data == 0) {
                        alert("成功。");
                    }
                    else {
                        alert("失败。");
                    }
                    page($("#dg").datagrid("getPager").pagination("options").pageNumber);
                    $("#win_add").window("close");
                }
            });

        }

    </script>
    
</div>

<div id="win_add" class="easyui-window" title="" style="width:350px;height:280px;display:none;" data-options="iconCls:'icon-edit',shadow:false,collapsible:false,minimizable:false,closed:true,modal:false,closable:true">
    <div class="easyui-layout" data-options="fit:true">
        <div data-options="region:'center'" style="text-align:center;">
            <div class="space-20"></div>

            <div>
                <label>类型:</label>
                <select id="state1" name="Auth" form="form_add">
                    <option selected="" value="0">送货员</option>
                    <option value="1">管理员</option>
                </select>
            </div>
            <form class="window_form" action="/Emp/Add" id="form_add" method="post">

                <div>
                    <label style="width:70px">名称:</label>
                    <input id="newName" type="text" singleSelect="true" name="Name" data-options="required:true,width:200" />
                    <div class="www" style="color:red;display:none">已存在相同名称！</div>
                </div>

                <div>
                    <label style="width:70px">密码:</label><input id="newPwd" type="password" singleSelect="true" name="Password" data-options="required:true,width:200" />
                    <div class="www" style="color:red;display:none">只能输入英文字母和数字！</div>
                </div>
                <div>
                    <label style="width:70px">重复密码:</label><input id="newPwd2" type="password" singleSelect="true" name="" data-options="required:true,width:200" />
                    <div class="www" style="color:red;display:none">两次输入不同！</div>
                </div>
                <div>
                    <label style="width:70px">联系电话:</label><input type="text" singleSelect="true" name="Phone" data-options="required:false,width:200" />
                </div>

                <div class="space-10"></div>
                <div style="text-align:center;padding:5px 0">
                    <a href="javascript:void(0)" class="easyui-linkbutton" onclick="submit('#form_add')" style="width:80px;height:30px">提交</a>
                    <a id="clearForm" href="javascript:void(0)" class="easyui-linkbutton" onclick="clearForm('#form_add')" style="width:80px;height:30px">清空</a>
                </div>
            </form>

        </div>
    </div>
</div>

<script>

    $("#newName").blur(function () {
        if ($(this).val() == "")
            return;
        $.ajax({
            type: 'post',
            url: '/Emp/ValidName',
            async: true,
            data: { "newName": $(this).val() },
            success: function (data) {
                if (data == 0) {
                    $(".www").eq(0).css("display", "none");
                }
                else {
                    $(".www").eq(0).css("display", "block");
                    $(this).val();
                }
            }
        });
    })

    $("#newPwd").blur(function () {
        if ($(this).val() == "")
            return;
        if ($(this).val().match(/^[A-Za-z0-9]+$/)) {
            $(".www").eq(1).css("display", "none");
        }
        else {
            $(".www").eq(1).css("display", "block");
            $(this).val("");
        }
    })

    $("#newPwd2").blur(function () {
        if ($(this).val() == $("#newPwd").val()) {
            $(".www").eq(1).css("display", "none");
        }
        else {
            $(".www").eq(2).css("display", "block");
            $(this).val("");
        }
    })

</script>

@*用户订单*@
<div id="win_details" class="easyui-window" title="未完成订单" style="width:500px;height:250px;display:none;" data-options="iconCls:'icon-add',shadow:false,collapsible:false,minimizable:false,closed:true,modal:false">
    <div class="easyui-layout" data-options="fit:true">
        <div data-options="region:'center'" style="text-align:center;">
            @*<div class="space-20"></div>*@
            <table id="orders" class="easyui-datagrid" title="" style="width:100%;height:100%" data-options="
                        rownumbers:true,
                        checkOnSelect:false,
                        pagination:false,
                        selectOnCheck:false,
                        fitColumns:true,
                        singleSelect:true,
                        ">
                <thead>
                    <tr>
                        <th data-options="field:'state',width:80,formatter:state1,align:'center'">状态</th>
                        <th data-options="field:'goodsName',width:80">商品名称</th>
                        <th data-options="field:'amount',width:80">数量</th>
                        <th data-options="field:'address',width:150">送货地址</th>
                        <th data-options="field:'startTime',width:150">下单时间</th>
                        @*<th data-options="field:'endTime',width:80">完成时间</th>*@
                        <th data-options="field:'customer',width:100">下单用户</th>
                        <th data-options="field:'postPhone',width:120,align:'right'">联系电话</th>
                    </tr>

                </thead>
            </table>

        </div>
    </div>
</div>



<script>
    function detailsline(id, event) {
        var e = event || window.event;
        e.stopPropagation();
        $("#win_details").window("open");
        $.ajax({
            type: 'post',
            url: "/Emp/GetOrder/" + id,
            dataType: 'json',
            success: function (data) {
                $("#orders").datagrid("loadData", data);

            }
        });
    }



    function state1(value, row, index) {
        switch (row.state) {
            case 0: return '<span style="color:blueviolet">待分配</span>';
            case 1: return '<span style="color:aquamarine">待发货</span>';
            case 2: return '<span style="color:green">待签收</span>';
            default: return '<span style="color:forestgreen">已完成</span>';
        }
    }
</script>

